
<html lang="en">
<head>
<meta charset="UTF-8">
<title>WebSDK API test</title>
</head>
<body>
<link rel="stylesheet" href="./res/rongcloud.css">
<a href="https://github.com/rongcloud/websdk-demo/blob/master/api-ie-test.html" class="get-source">获取源码</a>

<style>
body{
	font-size:14px;
	line-height:2;
	color:#333;
}
h1,h2{
	margin:0;
}
.panel span{
	display:inline-block;	
	width:60px;
}
.show{
	display:none;
	font-size:12px;
	border:1px solid #ccc;
	padding:10px 30px;
	width:300px;
	overflow:auto;
	position:fixed;
	right:10px;
	top:0;
	bottom:10px;
}
.btns{
	display:none;
}
.btns input,
.btns a{
	font-size:12px;
	margin:20px 10px 0 10px;
}
.other-demos{
	display:block;
	background:#f5f5f5;
	border:1px solid #ccc;
	padding:10px;
	display:inline-block;
}	
.result{
	display:none;
	background:#f5f5f5;
	margin-top:30px;
	width:730px;
	padding:5px;
	overflow:hidden;
}
.result h2{
	font-size:14px;
	margin:0;
	padding:0;
}
.result pre{
	background:#fff;
	border:1px solid #ccc;
	padding:10px;
	font-size:12px;
	font-family:verdana;
	margin:0;
}
.result pre h3{
	margin:0;
	padding:0;
	color:#cd0000;
}
</style>


<!-- 
check.js是做一些环境监测用的临时代码，仅限开发调试使用
-->

<!-- <script src="js/pre-check.js"></script> -->






<script src="//cdn.ronghub.com/RongIMLib-2.2.6.js"></script>
<script src="//cdn.ronghub.com/RongEmoji-2.2.4.min.js"></script> 
<script src="//cdn.ronghub.com/RongIMVoice-2.2.4.min.js"></script>



<script>
"use strict";
function showTips(data){
	var dom = document.getElementById("show");
		dom.style.display = "block";
	if(data){
		dom.innerHTML += "<li>" + data + "</li>";
	}else{
		dom.innerHTML = "";
	}
}	
function showResult(title,code,start){
	var dom = document.getElementById("result-area");
		dom.style.display = "block";
	

	var now = new Date().getTime();
	var t = document.getElementById("result");
		t.innerHTML = '<h3>' 
					+ title + '  <small>执行时间：'  + (now - start) + 'ms</small>' 
					+ '</h3>' 
					+ JSON.stringify(code,null,"\t");
}

function getTimer(begin){
	var now = new Date().getTime();
	return " time:" + (now - begin) + " ms";
}
</script>

<!-- 
用户数据，群组数据，好友关系 必须有应用服务器提供
显示会话信息需要从融云和应用服务器共同获取数据才能完整显示



开发环境 
	默认appkey = 8w7jv4qb78a9y，已上线
	当前用户：user8
	对象用户：user9,user10 

生产环境
	82hegw5uh8ktx
	rybznHwVbrk7upeAMWv8RnHEDKuqy0jJayFPsQ4gP8z+SyAuRRg4uk2hA24NDcnvbl6oswAYXQCdpAbHm4pp9g==
-->
<script>
"use strict";
var instance = null;
var appKey = "";
var token = "";

/*
消息全部用单聊，user8 -> user9
*/
var targetId = "user9"; // 目标 Id
var targetId2 = "user10"; // 目标 Id
//mock数据，实际项目从应用服务器获取
var usersInfo = {
	"user9" : {
		"userId" : "user9",
		"name" : "张三",
		"portraitUri" : "http://rongcloud.cn/images/newVersion/log_wx.png"

	}
};

var conversationtype = RongIMLib.ConversationType.PRIVATE; // 私聊

var begin = 0;

function init(){
	appKey = document.getElementById("appkey").value;
	token = document.getElementById("token").value;

	if(appKey == "" || token == ""){
		alert("必须提供appkey和token");
	}

	var targetIds = document.getElementById("targetId").value;
	if(targetIds == ""){
		alert("必须提供两个的有效targetId");
	}

	targetIds = targetIds.split("，").join(",").split(",");
	targetId = targetIds[0];	
	targetId2 = targetIds[1];	

	showTips();

	begin = new Date().getTime()

	/*
	文档：http://www.rongcloud.cn/docs/web.html
	*/
	
	//私有云初始化
	// var appkey = "";
	// var token = "";
	// var config = {
	// 	navi : "103.36.xxx.xxx"
	// }
	// RongIMLib.RongIMClient.init(appKey,null,config);

	//公有云初始化
	RongIMLib.RongIMClient.init(appKey);
	instance = RongIMClient.getInstance();
	showTips("初始化 应用 " + getTimer(begin));


	RongIMLib.RongIMEmoji.init();
	showTips("初始化 表情库 " + getTimer(begin));


	RongIMLib.RongIMVoice.init();
	showTips("初始化 声音库 " + getTimer(begin));


	// 连接状态监听器
	RongIMClient.setConnectionStatusListener({
		onChanged: function (status) {
		    switch (status) {
		        case RongIMLib.ConnectionStatus.CONNECTED:
		            showTips("链接成功 "  + getTimer(begin));
		            afterConnected();
		            break;
		        case RongIMLib.ConnectionStatus.CONNECTING:
		            showTips('正在链接');
		            break;
		        case RongIMLib.ConnectionStatus.DISCONNECTED:
		            showTips('断开连接');
		            break;
		        case RongIMLib.ConnectionStatus.KICKED_OFFLINE_BY_OTHER_CLIENT:
		            showTips('其他设备登录');
		            break;
		          case RongIMLib.ConnectionStatus.DOMAIN_INCORRECT:
		            showTips('域名不正确');
		            break;
		        case RongIMLib.ConnectionStatus.NETWORK_UNAVAILABLE:
		        	showTips('网络不可用');
		        	break;
		        }
		}
	});

	/*
	文档：http://www.rongcloud.cn/docs/web.html#3、设置消息监听器

	注意事项：
		1：为了看到接收效果，需要另外一个用户向本用户发消息
		2：判断会话唯一性 ：conversationType + targetId
		3：显示消息在页面前，需要判断是否属于当前会话，避免消息错乱。
		4：消息体属性说明可参考：http://rongcloud.cn/docs/api/js/index.html
	*/
	var start = new Date().getTime();
	RongIMClient.setOnReceiveMessageListener({
		// 接收到的消息
		onReceived: function (message) {
		    // 判断消息类型
		    showTips("新消息，类型为：" + message.messageType);
            // showResult("新消息",message,start);

            console.log(message);
		    switch(message.messageType){
		        case RongIMClient.MessageType.TextMessage:
		        	/*
		        	显示消息方法： 
		        	消息里是 原生emoji
		        	RongIMLib.RongIMEmoji.emojiToHTML(message.content.content);
		            */
		            break;
		        case RongIMClient.MessageType.VoiceMessage:
		        	/*
					引入SDK并初始化请参考文档 http://www.rongcloud.cn/docs/web.html#声音库

					api文档： http://www.rongcloud.cn/docs/api/js/VoiceMessage.html

					var audio = message.content.content //格式为 AMR 格式的 base64 码
		            var duration = message.content.duration;

					RongIMLib.RongIMVoice.preLoaded(audio,function(){
					    RongIMLib.RongIMVoice.play(audio,duration);
					});
		        	*/

		            
		            break;
		        case RongIMClient.MessageType.ImageMessage:
		           // message.content.content => 图片缩略图 base64。
		           // message.content.imageUri => 原图 URL。
		           break;
		        case RongIMClient.MessageType.DiscussionNotificationMessage:
		           // message.content.extension => 讨论组中的人员。
		           break;
		        case RongIMClient.MessageType.LocationMessage:
		           // message.content.latiude => 纬度。
		           // message.content.longitude => 经度。
		           // message.content.content => 位置图片 base64。
		           break;
		        case RongIMClient.MessageType.RichContentMessage:
		           // message.content.content => 文本消息内容。
		           // message.content.imageUri => 图片 base64。
		           // message.content.url => 原图 URL。
		           break;
		        case RongIMClient.MessageType.InformationNotificationMessage:
		            // do something...
		           break;
		        case RongIMClient.MessageType.ContactNotificationMessage:
		            // do something...
		           break;
		        case RongIMClient.MessageType.ProfileNotificationMessage:
		            // do something...
		           break;
		        case RongIMClient.MessageType.CommandNotificationMessage:
		            // do something...
		           break;
		        case RongIMClient.MessageType.CommandMessage:
		            // do something...
		           break;
		        case RongIMClient.MessageType.UnknownMessage:
		            // do something...
		           break;
		        default:
		            // do something...
		    }
		}
	});

	//开始链接
	RongIMClient.connect(token, {
		onSuccess: function(userId) {
			showTips("链接成功，用户id：" + userId);
		},
		onTokenIncorrect: function() {
			//console.log('token无效');
		},
		onError:function(errorCode){
		  var info = '';
		  switch (errorCode) {
		    case RongIMLib.ErrorCode.TIMEOUT:
		      info = '超时';
		      break;
		    case RongIMLib.ErrorCode.UNKNOWN_ERROR:
		      info = '未知错误';
		      break;
		    case RongIMLib.ErrorCode.UNACCEPTABLE_PaROTOCOL_VERSION:
		      info = '不可接受的协议版本';
		      break;
		    case RongIMLib.ErrorCode.IDENTIFIER_REJECTED:
		      info = 'appkey不正确';
		      break;
		    case RongIMLib.ErrorCode.SERVER_UNAVAILABLE:
		      info = '服务器不可用';
		      break;
		  }
		  showTips(info);
		}
	});
}

function afterConnected(){
	document.getElementById("panel").style.display = "none";
	document.getElementById("btns").style.display = "block";
	// instance = RongIMClient.getInstance();
}

function disconnect(){
	/*
	文档：http://www.rongcloud.cn/docs/api/js/RongIMClient.html
	*/

	instance.disconnect();
}

/*
	1: reconnect 是重新连接，并没有重连机制，调用此方法前应该进行网络嗅探，网络正常再调用 reconnect。
	2: 提示其他设备登录请勿调用重连方法。
 */
function reconnect(){
	//docs   http://www.rongcloud.cn/docs/api/js/RongIMClient.html
	begin = new Date().getTime();
	RongIMClient.reconnect({
		onSuccess: function(userId) {
			showTips("重新链接成功，用户id：" + userId + "; " + getTimer(begin));
		},
		onTokenIncorrect: function() {
			//console.log('token无效');
		},
		onError:function(errorCode){
		  var info = '';
		  switch (errorCode) {
		    case RongIMLib.ErrorCode.TIMEOUT:
		      info = '超时';
		      break;
		    case RongIMLib.ErrorCode.UNKNOWN_ERROR:
		      info = '未知错误';
		      break;
		    case RongIMLib.ErrorCode.UNACCEPTABLE_PaROTOCOL_VERSION:
		      info = '不可接受的协议版本';
		      break;
		    case RongIMLib.ErrorCode.IDENTIFIER_REJECTED:
		      info = 'appkey不正确';
		      break;
		    case RongIMLib.ErrorCode.SERVER_UNAVAILABLE:
		      info = '服务器不可用';
		      break;
		  }
		  showTips(info);
		}
	});
}

function sendTextMessage(){
	/*
	文档： http://www.rongcloud.cn/docs/web.html#5_1、发送消息
		   http://rongcloud.cn/docs/api/js/TextMessage.html
	1: 单条消息整体不得大于128K
	2: conversatinType 类型是 number，targetId 类型是 string
	*/

	var content = {
		// content:"hello " + encodeURIComponent('π，α，β'),
		content:"阿拉伯语：الشرق الأوسط ，希伯来语：המזרח התיכון。 ，，，，hello 😊 " + ' π，α，β, » 数字单位部分字符 如：× 拉丁文所有字符 如：Ο Ρ σ Ï Æ 拼音所有字符 如： ě ì ň 英文音标部分字符 如 ： ə ʃ 俄文部分字符 如 ：ш ; ⊇ â Œ Š ™ ',
		user : {
			"userId" : "this-is-a-test-id",
			"name" : "张三",
			"portraitUri" : "http://rongcloud.cn/images/newVersion/log_wx.png"
		},
		extra:{
			"name":"name",
			"age" : 12
		}
	};

	var msg = new RongIMLib.TextMessage(content);

	var start = new Date().getTime();
	instance.sendMessage(conversationtype, targetId, msg, {
        onSuccess: function (message) {
            showTips("发送文字消息成功");
            showResult("发送文字消息成功",message,start);
        },
        onError: function (errorCode,message) {
            showTips(errorCode);
            showResult("发送文字消息失败",message,start);
        }
    });
}

function sendImageMessage(){
	/*
	文档：http://www.rongcloud.cn/docs/api/js/ImageMessage.html

	上传插件文档: http://rongcloud.cn/docs/web.html#上传插件

	需要自行解决文件上传
	缩略图必须是base64码的jpg图，而且不带前缀"data:image/jpeg;base64,"，不得超过100K

	upload组件：https://github.com/rongcloud/rongcloud-web-im-upload
	*/

	var content = {
		imageUri: "http://rongcloud.cn/images/newVersion/log_wx.png", 
		content: getBase64Image()
	};

	var msg = new RongIMLib.ImageMessage(content);

	var start = new Date().getTime();
	instance.sendMessage(conversationtype, targetId, msg, {
        onSuccess: function (message) {
            showTips("发送图片消息成功");
            showResult("发送图片消息成功",message,start);
        },
        onError: function (errorCode,message) {
            showTips(errorCode);
            showResult("发送图片消息失败",message,start);
        }
    });	
}

function sendFileMessage(){
	/*
	upload组件：https://github.com/rongcloud/rongcloud-web-im-upload
	文档：http://www.rongcloud.cn/docs/api/js/ImageMessage.html

	上传插件文档: http://rongcloud.cn/docs/web.html#上传插件

	单条消息整体不得大于128K

	文件消息分两步：
		1、上传文件至文件服务器
		2、发送文件信息和文件 URL
	*/

	var content = {
	    name: 'log_wx', // 文件名称
	    size: '20k', // 文件大小，单位自己约定
	    type: 'png', // 文件的后缀名，例如 png、js、doc ...
	    fileUrl: 'http://rongcloud.cn/images/newVersion/log_wx.png' // 文件地址
	};

	var msg = new RongIMLib.FileMessage(content);

	var start = new Date().getTime();
	instance.sendMessage(conversationtype, targetId, msg, {
        onSuccess: function (message) {
            showTips("发送文件消息成功");
            showResult("发送文件消息成功",message,start);
        },
        onError: function (errorCode,message) {
            showTips(errorCode);
            showResult("发送文件消息失败",message,start);
        }
    });	
}

function sendVoiceMessage(){
	/*
	文档：http://www.rongcloud.cn/docs/api/js/VoiceMessage.html
		 http://www.rongcloud.cn/docs/web.html#8_1、_声音库引用地址

	需自行解决录音和转码问题，要求编码为amr

	接收到后的播放请见消息接收里的 case RongIMClient.MessageType.VoiceMessage
	*/
	var content = {
		content : "声音base64码",
		duration : 20
	};
	
	var msg = new RongIMLib.VoiceMessage(content);

	var start = new Date().getTime();
	instance.sendMessage(conversationtype, targetId, msg, {
        onSuccess: function (message) {
            showTips("发送语音消息成功");
            showResult("发送语音消息成功",message,start);

            /*
            play语音消息
			
			var voice = message.content.content;
			var duration = message.content.duration;  //单位为秒
			RongIMLib.RongIMVoice.preLoaded(voice,function(){
				RongIMLib.RongIMVoice.play(voice,duration);
			});
			*/
        },
        onError: function (errorCode,message) {
            showTips(errorCode);
            showResult("发送语音消息失败",message,start);
        }
    });
}

function registerMessageType(type){
	var messageName = type; // 消息名称。
	var objectName = "s:" + type; // 消息内置名称，请按照此格式命名 *:* 。
	var mesasgeTag = new RongIMLib.MessageTag(true,true);// 消息是否保存是否计数，true true 保存且计数，false false 不保存不计数。
	var propertys = ["name","age"]; // 消息类中的属性名。

	RongIMClient.registerMessageType(messageName,objectName,mesasgeTag,propertys);
}
function sendRegisterMessage(){
	/*
	文档：http://www.rongcloud.cn/docs/web_api_demo.html#自定义消息

	注意事项：
		1：init之前注册新消息类型
		2：对应接收 onReceived: function (message) {}
			message.messageType == "PersonMessage"
		3：需要自己做解析实现
	*/

	registerMessageType("PersonMessage");

	var content = {
		name:"RegisterMessage",
		age:3
	};

	var msg = new RongIMClient.RegisterMessage.PersonMessage(content);

	var start = new Date().getTime();
	instance.sendMessage(conversationtype, targetId, msg, {
        onSuccess: function (message) {
            showTips("发送自定义消息成功");
            showResult("发送自定义消息成功",message,start);
        },
        onError: function (errorCode,message) {
            showTips(errorCode);
            showResult("发送自定义消息失败",message,start);
        }
    });
}

function sendLocationMessage(){
	/*
	文档：http://www.rongcloud.cn/docs/api/js/LocationMessage.html

	缩略图必须是base64码的jpg图，而且不带前缀"data:image/jpeg;base64,"，不得超过100K

	注意事项：
		1：需要自己做显示效果
	*/

	var content = {
		"content":getBase64Image(),
		"latitude":"24.114",
		"longitude":"334.221",
		"poi":"北京市朝阳区北苑路北辰泰岳大厦"
	};

	var msg = new RongIMLib.LocationMessage(content);

	var start = new Date().getTime();
	instance.sendMessage(conversationtype, targetId, msg, {
        onSuccess: function (message) {
            showTips("发送自定义消息成功");
            showResult("发送自定义消息成功",message,start);
            // showMap(message);
        },
        onError: function (errorCode,message) {
            showTips(errorCode);
            showResult("发送自定义消息失败",message,start);
        }
    });	

    // function showMap(message){
    // 	var latitude = message.content.latitude;
    // 	var longitude = message.content.longitude;
    // 	var content = message.content.content;
    // 	var poi = message.content.poi;
    // }
}

function SendSyncReadStatusMessage(){
	var sentTime = 1486975569605;// message 的 sentTime。
	var content = {
		lastMessageSendTime: sentTime
	};
	var msg = new RongIMLib.SyncReadStatusMessage(content);

	var start = Date.now();
	instance.sendMessage(conversationtype, targetId, msg, {
        onSuccess: function (message) {
            showTips("发送同步消息成功");
            showResult("发送同步消息成功",message,start);
        },
        onError: function (errorCode,message) {
            showTips(errorCode);
            showResult("发送同步消息成功",message,start);
        }
    });	
}

function checkUnreadMessage(){
	/*
	http://www.rongcloud.cn/docs/web.html#5_5、检测是否有未读的消息

	此接口必须在init()方法之后调用，但不依赖于connect
	只返回true/false，不返回具体的未读数量
	若连接成功后调用此方法将一直返回 false。
	*/
	
	var start = new Date().getTime();
	instance.hasRemoteUnreadMessages(token,{
	    onSuccess:function(hasMessage){
	        if(hasMessage){
	            // 有未读的消息
	        }else{
	            // 没有未读的消息
	        }

            showTips("检查未读消息成功");
            showResult("检查未读消息成功",hasMessage,start);

	    },onError:function(err){
            showTips("检查未读消息失败");
            showResult("检查未读消息失败",err,start);
	    }
	});
}

function getHistroyMessage(){
	/*
	文档：http://www.rongcloud.cn/docs/web_api_demo.html#获取历史消息
	历史消息云存储开通位置：https://developer.rongcloud.cn/service/roam/rXxI4IAJjxRAD72SpQ==

	注意事项：
		1：一定一定一定要先开通 历史消息云存储 功能，本服务收费，测试环境可免费开通
		2：timestrap第二次拉取必须为null才能实现循环拉取
	*/

	var count = 10;  // 2 <= count <= 20
	var timestrap = null; //0, 1483950413013

	var start = new Date().getTime();
	instance.getHistoryMessages(conversationtype, targetId, timestrap, count, {
		onSuccess: function(list, hasMsg) {
			//可通过sort订制其他顺序
			console.log(list.length);
			console.log(hasMsg);
			list.sort(function(a,b){
				return a.sentTime < b.sentTime;
			});

            showTips("获取历史消息成功");
            showResult("获取历史消息成功",list,start);
		},
		onError: function(error) {
            showTips("获取历史消息失败");
            showResult("获取历史消息失败",error,start);
		}
	});
} 

function getConversationList(){	
	/*
	文档：http://www.rongcloud.cn/docs/web_api_demo.html#会话接口
		 http://www.rongcloud.cn/docs/web.html#5_2、同步会话列表
		 http://www.rongcloud.cn/docs/api/js/RongIMClient.html

	历史消息云存储开通位置：https://developer.rongcloud.cn/service/roam/rXxI4IAJjxRAD72SpQ==

	注意事项：
		1：一定一定一定要先开通 历史消息云存储 功能，本服务收费，测试环境可免费开通
		2：只有发过消息才能生成会话
	*/

	var conversationTypes = null;  //具体格式设置需要补充
	var limit = 10; //获取会话的数量，不传或传null为全部，暂不支持分页
	var start = new Date().getTime();
	instance.getConversationList({
		onSuccess: function(list) {
			list.sort(function(a,b){
				return a.sentTime > b.sentTime;
			});

			// list = jQuery.grep(list, function(n,i){
			// 	return (n!== 5 && i>4)
			// });

			// // console.log(list)
			// $.each(list,function(i,e){
			// 	// console.log(e);
			// 	console.log($(e));
			// });
			var title = "成功获取 " + list.length + " 个会话";
            showTips(title);
            showResult(title,list,start);
		},
		onError: function(error) {
            showTips("获取会话失败");
            showResult("获取会话失败",error,start);
		}
    },conversationTypes,limit);
}

function clearConversation(){
	var start = new Date().getTime();
	instance.clearConversations({ 
		onSuccess:function(){ 
            showResult("清除会话成功",null,start);
		}, 
		onError:function(error){ 
		// error => 清除会话错误码。 
		    showResult("清除会话失败",error,start);
		} 
	});
}

function getUnreadCount(){
	/*
		注意事项：

		获取未读消息数必须在获取会话列表和收到实时消息之后

		未读消息数存在 localStorage 中


	 */
	var start = Date.now();
	instance.getUnreadCount(conversationtype,targetId,{
	    onSuccess:function(count){
	       showTips("获取会话未读数成功");
	       showResult("获取会话未读数成功", count, start);
	    },
	    onError:function(error){
	       showTips("获取会话未读数失败");
	       showResult("获取会话未读数失败", error, start);
	    }
	});
}

function getTotalUnreadCount(){
	/*
		注意事项：

		获取未读消息数必须在获取会话列表和收到实时消息之后

		未读消息数存在 localStorage 中

	 */
	var start = Date.now();
	instance.getTotalUnreadCount({
	  onSuccess:function(count){
	       showTips("获取总未读数成功");
	       showResult("获取总未读数成功", count, start);
	  },
	  onError:function(error){
	      showTips("获取总未读数失败");
	      showResult("获取总未读数失败", error, start);
	  }
	});
}

function clearUnreadCount(){
	/*
		注意事项：

	 	此方法清除当前端的未读数，并不会多端同步，多端同步需要发送 SyncReadStatusMessage 	同步给多端 请参考 SendSyncReadStatusMessage。
	 	
	 */

	var start = Date.now();
	instance.clearUnreadCount(conversationtype,targetId,{
	    onSuccess:function(){
	        showTips("清除未读数成功");
	        showResult("清除未读数成功", "success", start);
	    },
	    onError:function(error){
	    	showTips("清除未读数失败");
	        showResult("清除未读数失败", error, start);
	    }
	});
}


function receiveMessage(){
	alert("请见init方法里的 RongIMClient.setOnReceiveMessageListener")
}


//加入聊天室后，可以用任意一个发送消息的方法发送消息，只需要conversationType为CHATROOM
var chatRoomId = "chatRoomId-008"; // 聊天室 Id,可任意指定，能区分不同聊天室即可
var count = 10; //拉取最近的会话内容（最近 n ( n <= 50 )条） 

function enterChatroom(){
	/*
	http://www.rongcloud.cn/docs/web_api_demo.html#聊天室

	聊天室不支持通过 getHistoryMessages 方法获取历史消息，
	可以在 joinChatRoom 时拉取最近的消息, 最多 50 条。
	*/

	var start = new Date().getTime();
	instance.joinChatRoom(chatRoomId, count, {
		onSuccess: function() {
            showTips("加入聊天室成功");
            showResult("加入聊天室成功",null,start);
		},
		onError: function(error) {
            showTips("加入聊天室失败");
            showResult("加入聊天室失败",null,start);
		}
	});
}

function quitChatroom(){
	var start = new Date().getTime();
	instance.quitChatRoom(chatRoomId, {
		onSuccess: function() {
            showTips("退出聊天室成功");
            showResult("退出聊天室成功",null,start);
		},
		onError: function(error) {
            showTips("退出聊天室失败");
            showResult("退出聊天室失败",null,start);
		}
	});
}

function getChatroomInfo(){
	/*
	需确认 当前用户 已加入聊天室
	*/ 
	var order = RongIMLib.GetChatRoomType.REVERSE;// 排序方式。
	var memberCount = 10; // 获取聊天室人数 （范围 0-20 ）

	var start = new Date().getTime();
	instance.getChatRoomInfo(chatRoomId, memberCount, order, {
	  onSuccess: function(chatRoom) {
			// chatRoom => 聊天室信息。
			// chatRoom.userInfos => 返回聊天室成员。
			// chatRoom.userTotalNums => 当前聊天室总人数。
            showTips("获取聊天室信息成功");
            showResult("获取聊天室信息成功",chatRoom,start);
	  },
	  onError: function(error) {
            showTips("获取聊天室信息失败");
            showResult("获取天室信息失败",error);
	  }
	});
}

function sendMessageToChatroom(){
	var content = {
		content:"hello，time：" + new Date().getTime(),
		extra:"RongCloud"
	};

	var conversationtype = RongIMLib.ConversationType.CHATROOM; // 私聊
	var msg = new RongIMLib.TextMessage(content);

	var start = new Date().getTime();
	instance.sendMessage(conversationtype, chatRoomId, msg, {
        onSuccess: function (message) {
            showTips("发送聊天室消息成功");
            showResult("发送聊天室消息成功",message,start);
        },
        onError: function (errorCode,message) {
            showTips(errorCode);
            showResult("发送聊天室消息失败",message,start);
        }
    });
}


var discussionName = "shuise`s discussion"; // 名称自定义
var userIds = [targetId];//讨论组初始成员。
var discussionId;

function getDiscussionInfo(discussionId,start){
	instance.getDiscussion(discussionId,{
		onSuccess:function(discussion){
			showResult("讨论组信息获取成功",discussion,start);
		},
		onError:function(error){
            showTips(error);
            showResult("讨论组信息获取失败",error,start);
		}
	});
}

function createDiscussion(){
	/*
	http://www.rongcloud.cn/docs/web_api_demo.html#讨论组
	
	*/ 
	var start = new Date().getTime();
	instance.createDiscussion(discussionName,userIds,{
	    onSuccess:function(discussionId){
	    	window.discussionId = discussionId;
            showTips("讨论组创建成功");

			getDiscussionInfo(discussionId,start);
	    },
	    onError:function(error){
            showTips(error);
            showResult("讨论组创建失败",error,start);
	    }
	});
}

function setDiscussionName(){
	var start = new Date().getTime();
	var discusstionName = "another discussion";

	instance.setDiscussionName(discussionId,discusstionName,{
	    onSuccess:function(){
            showTips("讨论组改名成功");
            showResult("讨论组改名成功",null,start);

            getDiscussionInfo(discussionId,start);
	    },
	    onError:function(error){
            showTips("讨论组改名失败");
            showResult("讨论组改名失败",error,start);
	    }
	});
}

function setDiscussionStatus(){
	var status = RongIMLib.DiscussionInviteStatus.CLOSED; 
	/* 讨论邀请状态 ，默认开放
	0 ： 开发邀请，
	1：关闭邀请  
	RongIMLib.DiscussionInviteStatus.OPEND
	RongIMLib.DiscussionInviteStatus.CLOSED
	*/
	var start = new Date().getTime();
	instance.setDiscussionInviteStatus(discussionId,status,{
	    onSuccess:function(){
            showTips("讨论组状态修改成功");
            // showResult("讨论组状态修改成功",null,start);

            getDiscussionInfo(discussionId, start);
	    },
	    onError:function(error){
            showTips("讨论组状态修改成功");
            showResult("讨论组状态修改成功",error,start);
	    }
	});
}

function addMemberToDiscussion(){
	var userIds = [targetId2];//被邀请成员。

	var start = new Date().getTime();
	instance.addMemberToDiscussion(discussionId,userIds,{
	    onSuccess:function(){
            showTips("讨论组加人成功");
            // showResult("讨论组加人成功",null,start);

            getDiscussionInfo(discussionId, start);
	    },
	    onError:function(error){
            showTips("讨论组加人失败");
            showResult("讨论组加人失败",error,start);
	    }
	});
}

function removeMemberFromDiscussion(){
	var userIds = targetId2;//被邀请成员。

	var start = new Date().getTime();

	instance.removeMemberFromDiscussion(discussionId,userIds,{
	    onSuccess:function(){
            showTips("讨论组踢人成功");
            // showResult("讨论组踢人成功",null,start);

            getDiscussionInfo(discussionId, start);
	    },
	    onError:function(error){
            showTips("讨论组加人失败");
            showResult("讨论组加人失败",error,start);
	    }
	});
}

function quitDiscussion(){
	var start = new Date().getTime();

	instance.quitDiscussion(discussionId,{
	    onSuccess:function(){
            showTips("退出讨论组 成功");
            // showResult("讨论组踢人成功",null,start);

            getDiscussionInfo(discussionId, start);
	    },
	    onError:function(error){
	    	showTips("退出讨论组 失败");
	    	showResult("退出讨论组 失败",error,start);
	    }
	});
}


/*
公众号
RongIMLib.ConversationType = {
	APP_PUBLIC_SERVICE : "应用服务平台 mc",
	PUBLIC_SERVICE : "公众服务平台 mp"
};
*/

var publicServiceType = RongIMLib.ConversationType.APP_PUBLIC_SERVICE; //固定值
var publicServiceId = "shuise"; //RongCloud
var searchType = 1; //[0-exact 1-fuzzy]
var keywords = "Rong";
// var keywords = "test";

/*
用户给公众号发消息
var conversationtype = RongIMLib.ConversationType.PUBLIC_SERVICE;
var targetId = publicServiceId
*/

function getPublicServiceList(){
	/* 
	getRemotePublicServiceList = function (mpId, conversationType, pullMessageTime, callback)  
	*/ 
	var start = new Date().getTime();

	instance.getPublicServiceList({
	    onSuccess:function(list){
            showTips("获取已关注公众号 成功");
            showResult("获取已关注公众号 成功",list,start);
	    },
	    onError:function(error){
	    	showTips("获取已关注公众号 失败");
	    	showResult("搜索获取已关注公众号公众号 失败",error,start);
	    }
	});
}

function searchPublicService(){
	console.log(searchPublicService);
	/*
	WebAPI文档：http://www.rongcloud.cn/docs/api/js/RongIMClient.html
	iOS文档：http://www.rongcloud.cn/docs/ios_imlib.html#公众服务
	*/ 
	var start = new Date().getTime();

	instance.searchPublicService(searchType, keywords, {
	    onSuccess:function(list){
            showTips("查找公众号 成功");
            showResult("查找公众号 成功",list,start);
	    },
	    onError:function(error){
	    	showTips("查找公众号 失败");
	    	showResult("查找公众号 失败",error,start);
	    }
	});
}

// function searchPublicServiceByType(){
// 	var start = new Date().getTime();

// 	instance.searchPublicServiceByType(publicServiceType, searchType, keywords, {
// 	    onSuccess:function(list){
//             showTips("搜索公众号by type 成功");
//             showResult("搜索公众号by type 成功",list,start);
// 	    },
// 	    onError:function(error){
// 	    	showTips("搜索公众号by type 失败");
// 	    	showResult("搜索公众号by type 失败",error,start);
// 	    }
// 	});
// }

function subscribePublicService(){
	/*
	http://www.rongcloud.cn/docs/api/js/RongIMClient.html

	*/
	var start = new Date().getTime();

	instance.subscribePublicService(publicServiceType, publicServiceId, {
	    onSuccess:function(list){
            showTips("订阅公众号 成功");
            showResult("订阅公众号 成功",list,start);
	    },
	    onError:function(error){
	    	showTips("订阅公众号 失败");
	    	showResult("订阅公众号 失败",error,start);
	    }
	});
}

function unsubscribePublicService(){
	/*
	http://www.rongcloud.cn/docs/api/js/RongIMClient.html
	
	*/
	var start = new Date().getTime();

	instance.unsubscribePublicService(publicServiceType, publicServiceId, {
	    onSuccess:function(list){
            showTips("取消订阅公众号 成功");
            showResult("取消订阅公众号 成功",list,start);
	    },
	    onError:function(error){
	    	showTips("取消订阅公众号 失败");
	    	showResult("取消订阅公众号 失败",error,start);
	    }
	});
}

function getPublicServiceProfile(){
	/*
	http://www.rongcloud.cn/docs/api/js/RongIMClient.html

	必须是已经关注的公众号，才能获取到详情
	*/
	var start = new Date().getTime();

	instance.getPublicServiceProfile(publicServiceType, publicServiceId, {
		onSuccess:function(profile){
            showTips("获取公众号详情 成功");
            showResult("获取公众号详情 成功",profile,start);
  			console.log(profile);
		},
	  	onError:function(){
	  		cosnole.log("获取公众号详情 error");
	  	}
	});
}


function upload(){
	window.open('http://rongcloud.cn/docs/web.html#上传插件');
}

//获取base64假数据方法
function getBase64Image(){
	var canvas = document.createElement("canvas");
		canvas.width = 100;
		canvas.height = 100;


	var context = canvas.getContext("2d");	
		context.font = "20pt Arial";    			
		context.fillStyle = "blue"; 
		context.fillText("RongCloud.cn", 10, 20);
	var content = canvas.toDataURL("image/jpeg");
		content = content.replace("data:image/jpeg;base64,","");
	return content;
}
</script>



<h1>Web SDK demo</h1>
<div class="panel" id="panel">
	<p>
		<span>appkey</span>
		<input type="text" id="appkey" size="20" value="8w7jv4qb78a9y">
	</p>
	<p>
		<span>token</span>
		<input type="text" id="token" size="110" value="4FGCL0oQ/E72nU4ivbui8uHR/ySxKaD1cAX2biXsYR6RsLYO9xAA4ooa+q3n42JnVTQyMAdFUiDsjFRDYZaQeg==">
		<!-- 
		8w7jv4qb78a9y
		user9	ZThhLI1Xa1BX5EMREAdArWSH6ouuI8NT/fNmMkzF+4IOKIoFvbsi6JnH8QmnSltLkCcsK8vOgKl3IZgfbxFiWg==
		user10	4FGCL0oQ/E72nU4ivbui8uHR/ySxKaD1cAX2biXsYR6RsLYO9xAA4ooa+q3n42JnVTQyMAdFUiDsjFRDYZaQeg== 
		-->

		<!-- 
		82hegw5uh8ktx
		rybznHwVbrk7upeAMWv8RnHEDKuqy0jJayFPsQ4gP8z+SyAuRRg4uk2hA24NDcnvbl6oswAYXQCdpAbHm4pp9g==
		-->
	</p>
	<p>
		<span>targetIds</span>
		<input type="text" id="targetId" size="25" value="user9,user8">
		<em>逗号间隔，至少提供两个</em>
	</p>
	<p>
		<span>&#160;</span>
		<input type="button" onclick="init()" value="初始化">  &#160;&#160;<strong>所有业务方法都必须在 链接成功 之后执行</strong>
	</p>
</div>

<div class="btns" id="btns">
	链接状态：
	<input type="button" value="断开链接" onclick="disconnect();">
	<input type="button" value="重新链接" onclick="reconnect();">

	<br>


	发送消息：
	<input type="button" value="文字消息" onclick="sendTextMessage();">
	<input type="button" value="图片消息" onclick="sendImageMessage();">
	<input type="button" value="文件消息" onclick="sendFileMessage();">
	<input type="button" value="语音消息" onclick="sendVoiceMessage();">
	<input type="button" value="自定义消息" onclick="sendRegisterMessage();">
	<input type="button" value="位置消息" onclick="sendLocationMessage();"> 
	<input type="button" value="同步状态消息" onclick="SendSyncReadStatusMessage();">

	<br>

	接收消息：
	<input type="button" value="检查未读消息" onclick="checkUnreadMessage();"> 
	<input type="button" value="消息接收" onclick="receiveMessage();"> 
	<input type="button" value="历史消息" onclick="getHistroyMessage();"> 

	<br>

	会&nbsp;&nbsp;话：
	<input type="button" value="会话列表" onclick="getConversationList();">
	<input type="button" value="会话未读数" onclick="getUnreadCount();"> 
	<input type="button" value="会话未读总数" onclick="getTotalUnreadCount();"> 
	<input type="button" value="清除会话未读数" onclick="clearUnreadCount();">
	<input type="button" value="清除会话" onclick="clearConversation();">

	<br>

	聊 天 室：
	<input type="button" value="加入聊天室" onclick="enterChatroom();"> 
	<input type="button" value="聊天室发消息" onclick="sendMessageToChatroom();"> 
	<input type="button" value="退出聊天室" onclick="quitChatroom();"> 
	<input type="button" value="获取聊天室信息" onclick="getChatroomInfo();"> 

	<br>

	讨论组：
	<input type="button" value="讨论组创建" onclick="createDiscussion();"> 
	<input type="button" value="讨论组改名" onclick="setDiscussionName();"> 
	<input type="button" value="讨论组状态" onclick="setDiscussionStatus();"> 
	<input type="button" value="讨论组加人" onclick="addMemberToDiscussion();"> 
	<input type="button" value="讨论组踢人" onclick="removeMemberFromDiscussion();"> 
	<input type="button" value="退出讨论组" onclick="quitDiscussion();"> 

	<br>

	公众服务：
	<input type="button" value="获取已关注公众号" onclick="getPublicServiceList();"> 
	<input type="button" value="查找公众号" onclick="searchPublicService();"> 
	<!-- <input type="button" value="查找公众号 byType" onclick="searchPublicServiceByType();">  -->
	<input type="button" value="订阅公众号" onclick="subscribePublicService();"> 
	<input type="button" value="取消订阅公众号" onclick="unsubscribePublicService();"> 
	<input type="button" value="获取公众号信息" onclick="getPublicServiceProfile();"> 
	
	<br>
	<br>
</div>

<div class="result" id="result-area">
	<!-- <h2>运行结果：</h2> -->
	<pre id="result"></pre>
</div>


<ol id="show" class="show"></ol>

</body>
</html>